<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta http-equiv="X-UA-Compatible" content="ie=edge" />
        <title>08.post方式提交数据注意事项</title>
        <script>
        		
            window.onload = function () {
                var oBtn = document.getElementById("btn1");
                oBtn.addEventListener('click', function () {
                    var oxhr = null;
                    if (window.XMLHttpRequest) {
                        oxhr = new XMLHttpRequest();
                    } else {
                        oxhr = new ActiveXObject("Microsoft.XMLHTTP");
                    }

                    oxhr.open('POST', './php/1.post.php', true);

					/**
					 * POST数据是放在send()方法里面的
					 * 1.不存在像GET方式IE下会有缓存问题
					 * 2.不存在像GET方式一样有中文乱码问题
					 * 3.记得POST方式发送数据之前一定要设置请求头，不然
					 * 也同样接收不到服务器返回回来的数据
					 */
					oxhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
                    oxhr.send('userName=allen&password=123456&age=29&gender=男');

                    oxhr.onreadystatechange = function () {
                        if (oxhr.readyState == 4) {
                            if ((oxhr.status >= 200 && oxhr.status < 300) || oxhr.status == 304) {
                                alert(oxhr.responseText);
                            } else {
                            		alert('通信失败：' + oxhr.status);
                            }
                        }
                    };
                }, false);
            };
        </script>
    </head>
    <body>
        <input type="button" value="获取POST数据" id="btn1" />
    </body>
</html>
